﻿<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML>
<html>
  <head>
    <base href="<%=basePath%>">
    
   <title>麦包郎</title>
		<meta name="description" content="麦包郎" />
		<meta name="keywords" content="麦包郎"/>
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<link rel="stylesheet" href="css/amazeui.min.css" />
		<link rel="stylesheet" href="css/style.css" />
		<script type="text/javascript" src="js/jquery.min.js" ></script>
		<script type="text/javascript" src="js/amazeui.min.js" ></script>

	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
  </head>
  
  <body>
  <div data-am-widget="slider" class="am-slider am-slider-default" data-am-slider='{}' >
			  <ul class="am-slides">
			<li><img src="images/beijing.png" style='height:60px;'> </li>



		</ul>
		</div>
		<div class="nbxt">  麦包郎</div>
			<ul style="position: relative;" class="am-slides">
				<li class="b2"></li>

				<input style="position: absolute;top: 20%; width: 70%; margin-left: 7%; " type="text" id="sou" class="cate-input" placeholder="搜索">
				<img onclick="sou()" style="position: absolute; top: 25%; left: 82%;width: 28px;height: 28px" src="images/shousuo.png" alt="">
			</ul>
<!--包子皮-->
		<div id="q1"  style="display: block" >
		<ul class="nav">
			<li>
				<p class="qq1">
					<img src="images/icon.jpg" />
					<p style="color: red">馅料</p>
				</p>
			</li>
			<li>
				<p class="qq1"  >
					<img src="images/icon1.jpg" />
					<p>饮品(粥)</p>
				</p>
			</li>
			<li>
				<p class="qq1">
					<img src="images/icon2.jpg" />
					<p>其他</p>
				</p>
			</li>

		</ul>
	      <ul style="position: relative;" data-am-widget="gallery" class="am-gallery am-avg-sm-2 am-avg-md-3 am-avg-lg-4 am-gallery-default product">
			<c:forEach items="${piList}" var="pi">
		          <li style="width: 100%; position: relative; border-top: 1px solid gainsboro;border-bottom: 1px solid gainsboro;">
		        <div style="position: relative;"  class="am-gallery-item">
		              <img style="width: 102px;height:102px;" src="<%=basePath %>${pi.image}" alt=""/>
		              <div style="float: right;margin-right: 40%;" class="am-gallery-desc">
						  <h3 class="am-gallery-title">${pi.name}</h3>
						  <h3 style="margin-top: 30%" class="am-gallery-title">${pi.weight}</h3>
		              	<em style="margin-top: 22%">￥${pi.price}</em>
		              	<input type="hidden" class="bian" value="${pi.id}"/>
		              	
		              </div>
					<div style=" position: absolute; top: 50%;left: 66%;">
						<span class="jian" >-</span>
						<input class="jg" type="text" readonly="readonly" value="0">
						<span class="jia">+</span>
					</div>
		        </div>
		      </li>
		      </c:forEach>
		 </ul>



		</div>
<!---->
<!--包子陷-->

		<div id="q2" style="display: none">

		<ul class="nav">
			<li>
				<p class="qq1">
					<img src="images/icon.jpg" />
					<p>馅料</p>
				</p>
			</li>
			<li>
				<p class="qq1"  >
					<img src="images/icon1.jpg" />
					<p style="color: red">饮品(粥)</p>
				</p>
			</li>
			<li>
				<p class="qq1">
					<img src="images/icon2.jpg" />
					<p>其他</p>
				</p>
			</li>

		</ul>
		<ul style="position: relative;" data-am-widget="gallery" class="am-gallery am-avg-sm-2 am-avg-md-3 am-avg-lg-4 am-gallery-default product">
		<c:forEach items="${xianList}" var="pi">
			<li style="width: 100%; position: relative; border-top: 1px solid gainsboro;border-bottom: 1px solid gainsboro;">
				<div style="position: relative;"  class="am-gallery-item">
					<img style="width: 102px;height:102px;" src="<%=basePath %>${pi.image}" alt=""/>
					<div style="float: right;margin-right: 40%;" class="am-gallery-desc">
						<h3 class="am-gallery-title">${pi.name}</h3>
						<h3 style="margin-top: 30%" class="am-gallery-title">${pi.weight}</h3>
						<em style="margin-top: 22%">￥${pi.price}</em>
						<input type="hidden" class="bian1" value="${pi.id}"/>
					</div>
					<div  style=" position: absolute; top: 50%;left: 66%;">
						<span class="jian1" >-</span>
						<input class="jg1" type="text" readonly="readonly" value="0">
						<span class="jia1">+</span>
					</div>
				</div>
			</li>
			</c:forEach>
		</ul>


	</div>

<!---->
<!--饮品-->

		<div id="q3" style="display: none">

			<ul class="nav">
			<li>
				<p class="qq1">
					<img src="images/icon.jpg" />
					<p >馅料</p>
				</p>
			</li>
			<li>
				<p class="qq1"  >
					<img src="images/icon1.jpg" />
					<p>饮品(粥)</p>
				</p>
			</li>
			<li>
				<p class="qq1">
					<img src="images/icon2.jpg" />
					<p style="color: red">其他</p>
				</p>
			</li>

		</ul>
			<ul style="position: relative;" data-am-widget="gallery" class="am-gallery am-avg-sm-2 am-avg-md-3 am-avg-lg-4 am-gallery-default product">
				<c:forEach items="${yinList}" var="pi">
				
				<li style="width: 100%; position: relative; border-top: 1px solid gainsboro;border-bottom: 1px solid gainsboro;">
					<div style="position: relative;"  class="am-gallery-item">
						<img style="width: 102px;height:102px;" src="<%=basePath %>${pi.image}" alt=""/>
						<div style="float: right;margin-right: 40%;" class="am-gallery-desc">
							<h3 class="am-gallery-title">${pi.name}</h3>
							<h3 style="margin-top: 30%" class="am-gallery-title">${pi.weight}</h3>
							<em style="margin-top: 22%">￥${pi.price}</em>
							<input type="hidden" class="bian2" value="${pi.id}"/>
							
						</div>
						<div style=" position: absolute; top: 50%;left: 66%;">
							<span class="jian2" >-</span>
							<input class="jg2" type="text" readonly="readonly" value="0">
							<span class="jia2">+</span>
						</div>
					</div>
				</li>
				</c:forEach>
			</ul>



		</div>
		<!---->

			<div class="h50"></div>
			<div data-am-widget="navbar" class="am-navbar am-cf am-navbar-default footer "  id="">
				<ul class="am-navbar-nav am-cf am-avg-sm-4">
					<li >
						<a href="#" class="">
							<span class=""><img src="images/nav12.png"/></span>
							<span class="am-navbar-label">订货</span>
						</a>
					</li>
					<li>
						<a  class="" onclick="ti()">
							<span class=""><img src="images/shop.png"/></span>
							<span class="am-navbar-label">购物车</span>
							<div id="yuan"><span id="value">0</span></div>
						</a>
					</li>

					<li >
						<a href="<%=basePath%>emp/goMember" class="">
							<span class=""><img src="images/nav16.png"/></span>
							<span class="am-navbar-label">我的</span>
						</a>
					</li>

				</ul>
			</div>




	</body>
	<script type="text/javascript" src="js/index.js" ></script>
	<script type="text/javascript">
	function sou(){
		var sou="content="+$("#sou").val();
		sou=encodeURI(encodeURI(sou));
		window.location.href="commodity/sou?"+sou; 
	

				
			
			
		}

	</script>
  </body>
</html>
